@use '@angular/material' as mat;
@import '@angular/material/theming';

// TODO: As of v15 mat.legacy-core no longer includes default typography styles.
// If you specify typography styles for the components you use elsewhere, you should delete this line.
// If you don't need the default component typographies but still want the hierarchy styles,
// you can delete this line and instead use:
// `@include mat.legacy-typography-hierarchy(mat.define-legacy-typography-config());`
@include mat.all-legacy-component-typographies();
@include mat.legacy-core();

// Header theme
$my-header-primary: mat.define-palette(mat.$grey-palette, 100);
$my-header-accent: mat.define-palette(mat.$pink-palette);
$my-header-warn: mat.define-palette(mat.$red-palette);
$my-header-theme: mat.define-light-theme((
  color: (
    primary: $my-header-primary,
    accent: $my-header-accent,
    warn: $my-header-warn,
  ),
  typography: mat.define-typography-config(),
  density: 0,
));
@include mat.menu-theme($my-header-theme);

// Checkbox theme
$my-checkbox-primary: mat.define-palette(mat.$grey-palette, 800);
$my-checkbox-accent: mat.define-palette(mat.$grey-palette, 800);
$my-checkbox-warn: mat.define-palette(mat.$red-palette);
$my-checkbox-theme: mat.define-light-theme((
  color: (
    primary: $my-checkbox-primary,
    accent: $my-checkbox-accent,
    warn: $my-checkbox-warn,
  ),
  typography: mat.define-typography-config(),
  density: 0,
));
@include mat.checkbox-theme($my-checkbox-theme);
@include mat.pseudo-checkbox-theme($my-checkbox-theme);

// Radio theme
$my-radio-primary: mat.define-palette(mat.$grey-palette, 800);
$my-radio-accent: mat.define-palette(mat.$grey-palette, 800);
$my-radio-warn: mat.define-palette(mat.$red-palette);
$my-radio-theme: mat.define-light-theme((
  color: (
    primary: $my-radio-primary,
    accent: $my-radio-accent,
    warn: $my-radio-warn,
  ),
  typography: mat.define-typography-config(),
  density: 0,
));
@include mat.radio-theme($my-radio-theme);

// Button theme
$my-button-primary: mat.define-palette(mat.$blue-palette, A200);
$my-button-accent: mat.define-palette(mat.$red-palette, 600);
$my-button-warn: mat.define-palette(mat.$red-palette, 600);
$my-button-theme: mat.define-light-theme((
  color: (
    primary: $my-button-primary,
    accent: $my-button-accent,
    warn: $my-button-warn,
  ),
  typography: mat.define-typography-config(),
  density: 0,
));
@include mat.button-theme($my-button-theme);

// Slide-toggle theme
$my-slide-toggle-primary: mat.define-palette(mat.$blue-palette, 700);
$my-slide-toggle-accent: mat.define-palette(mat.$green-palette, 600);
$my-slide-toggle-warn: mat.define-palette(mat.$red-palette, 600);
$my-slide-toggle-theme: mat.define-light-theme((
  color: (
    primary: $my-slide-toggle-primary,
    accent: $my-slide-toggle-accent,
    warn: $my-slide-toggle-warn,
  ),
  typography: mat.define-typography-config(),
  density: 0,
));
@include mat.slide-toggle-theme($my-slide-toggle-theme);

// Slider theme
$my-slider-primary: mat.define-palette(mat.$blue-palette, 700);
$my-slider-accent: mat.define-palette(mat.$green-palette, 600);
$my-slider-warn: mat.define-palette(mat.$red-palette, 600);
$my-slider-theme: mat.define-light-theme((
  color: (
    primary: $my-slider-primary,
    accent: $my-slider-accent,
    warn: $my-slider-warn,
  ),
  typography: mat.define-typography-config(),
  density: 0,
));
@include mat.slider-theme($my-slider-theme);

// Define a dark theme
$dark-primary: mat.define-palette(mat.$blue-palette);
$dark-accent: mat.define-palette(mat.$amber-palette, A200, A100, A400);
$dark-warn: mat.define-palette(mat.$deep-orange-palette);
$dark-theme: mat.define-dark-theme((
  color: (
    primary: $dark-primary,
    accent: $dark-accent,
    warn: $dark-warn,
  ),
  typography: mat.define-typography-config(),
  density: 0,
));

// Themes will be switched based on class names. Angular will switch classes which will trigger the theme change.
.dark-theme {
  @include mat.all-legacy-component-themes($dark-theme);
}

@import 'codemirror/lib/codemirror';
@import 'codemirror/theme/material';
@import 'codemirror/addon/lint/lint';
@import 'codemirror/addon/hint/show-hint';
